<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="../node_modules/bootstrap/dist/css/bootstrap.css">

    <title>Document</title>
</head>

<body>
    <form class="form-horizontal">

        <div class="form-group">
            <label class="col-sm-2 control-label">商品名称</label>
            <div class="col-sm-10">
                <input type="text" class="form-control name" id="inputPassword3" placeholder="商品名称">
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label">商品价格</label>
            <div class="col-sm-10">
                <input type="text" class="form-control price" id="inputPassword3" placeholder="商品价格">
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label">商品标题</label>
            <div class="col-sm-10">
                <input type="text" class="form-control title" id="inputEmail3" placeholder="商品编号">
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label">商品关键字</label>
            <div class="col-sm-10">
                <input type="text" class="form-control tag" id="inputEmail3" placeholder="商品编号">
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label">商品的评论数</label>
            <div class="col-sm-10">
                <input type="text" class="form-control commentCount" id="inputPassword3" placeholder="商品的库存量">
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label">图片路径</label>
            <div class="col-sm-10">
                <input type="text" class="form-control src" id="inputPassword3" placeholder="图片路径">
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-offset-2 col-sm-10">
                <button type="button" class="btn btn-primary">确认添加商品</button>
            </div>
        </div>
    </form>
    <script src="../node_modules/jquery/dist/jquery.js"></script>
    <script>
        $(() => {
            $(".btn-primary").click(function() {
                if ($.trim($(".name").val()) && $.trim($(".title").val()) && $.trim($(".price").val()) && $.trim($(".tag").val()) && $.trim($(".src").val()) && $.trim($(".commentCount").val())) {
                    $.ajax({
                        type: "post",
                        url: "/admin/adddata",
                        data: {
                            name: $.trim($(".name").val()),
                            title: $.trim($(".title").val()),
                            price: $.trim($(".price").val()),
                            tag: $.trim($(".tag").val()),
                            src: $.trim($(".src").val()),
                            commentCount: $.trim($(".commentCount").val()),
                        },
                        dataType: "json",
                        success: response => {
                            console.log(response);
                            if (response.msg == "添加成功") {
                                alert("添加成功")
                            }
                        }
                    })
                } else {
                    alert("请输入完整信息")
                }
            })
        })
    </script>
</body>

</html>